<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
    <link rel="stylesheet" href="css/user.css">
</head>
<body>
  
  <div id="app">

    <table>

      <thead >
          <tr>
              <th>ID</th>
              <th>用户名</th>
              <th>密码</th>
              <th>昵称</th>
              <th>年龄</th>
              <th>修改时间</th>
          </tr>
      </thead>

      <tbody>
<!--      {{ userList[0].username }}-->
<!--          <tr   v-for="user in userList" >-->
<!--              <td>{{ user.SerialNumber }}</td>-->
<!--              <td>{{ user.username }}</td>-->
<!--              <td>{{ user.password }}</td>-->
<!--              <td>{{ user.nickname }}</td>-->
<!--              <td>{{ user.age }}</td>-->
<!--              <td>{{ user.updateTime }}</td>-->
<!--          </tr>-->
<!--             <tr   :for="user in userList" >-->
<!--                 <td>{{ user.SerialNumber }}</td>-->
<!--                 <td>{{ user.username }}</td>-->
<!--                 <td>{{ user.password }}</td>-->
<!--                 <td>{{ user.nickname }}</td>-->
<!--                 <td>{{ user.age }}</td>-->
<!--                 <td>{{ user.updateTime }}</td>-->
<!--             </tr>-->


          </tbody>

        </table>

      </div>
      <!--引入axios-->
  <script src="./js/axios.min.js"></script>
  <script type="module">
    import { createApp } from './js/vue.esm-browser.js'
    createApp({
        data(){
            userList:[]
        },
        methods:{
           async getListArray(){
             const result =  await axios.get('/list');
             this.userList = result.data;

             console.log("result-----------》》》》》", this.userList);
            }
        },
        mounted(){

            this.getListArray();

        }
    }).mount("#app")


  </script>


</body>
</html>